<!DOCTYPE html>
<html>

	<head>

		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/jquery.fullPage.css" />
		<link rel="stylesheet" type="text/css" href="css/index.css" />
		<script src="js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery.fullPage.min.js" type="text/javascript" charset="utf-8"></script>
	</head>

	<body>
		<div id="fullpage">
			<div class="section index">Some section首页</div>
			<div class="section page1">
				<div class="melon">

				</div>
			</div>
			<div class="section page2">
				Some section page2
				<div class="melon">
					
				</div>
			</div>
			<div class="section page3">Some section page3</div>
			<div class="section evaluate">Some section evaluate</div>
		</div>
		<script type="text/javascript">
			$(document).ready(function() {
				$('#fullpage').fullpage({
					//afterLoad页面触发的信息
					afterLoad: function(anchorLink, index) {
						if(index == 2) {
							//alert("Section 2 ended loading");
							document.querySelector(".melon").classList.add("my_bc_black");
						}
						if(index == 3) {
							//alert("Section 2 ended loading");
							document.querySelector(".melon").classList.add("my_bc_black");
						}
						
					}
				});
			});
		</script>
	</body>

</html>